﻿<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<div id = "app">
			<p>{{message | uppercase | reverse}}</p>
		</div>
	
		<script src="vue.js"></script>
		<script>
			Vue.filter('uppercase', function (value) {
			  if (!value) return '';
			  value = value.toString();
			  return value.toUpperCase();
			})
			
			Vue.filter('reverse', function (value) {
			  if (!value) return '';
			  value = value.toString();
			  return value.split('').reverse().join('');
			})
			
			var vm = new Vue({
		    el: '#app',
		    data: {
		    	message: 'hello world'
		    }
		  });
		</script>
	</body>
</html>